<!--

    Copyright (c) 2010-2025 Eclipse Dirigible contributors

    All rights reserved. This program and the accompanying materials
    are made available under the terms of the Eclipse Public License v2.0
    which accompanies this distribution, and is available at
    http://www.eclipse.org/legal/epl-v20.html

    SPDX-FileCopyrightText: Eclipse Dirigible contributors
    SPDX-License-Identifier: EPL-2.0

-->
<!DOCTYPE HTML>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" ng-app="page" ng-controller="PageController">

    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="icon" sizes="any" href="data:;base64,iVBORw0KGgo=">
        <title config-title></title>
        <script type="text/javascript" src="/services/web/editor-report/configs/report-editor.js"></script>
        <script type="text/javascript" src="/services/js/platform-core/services/loader.js?id=editor-js"></script>
        <link type="text/css" rel="stylesheet" href="/services/js/platform-core/services/loader.js?id=view-css" />
        <script type="text/javascript" src="/services/web/editor-report/js/editor.js"></script>
    </head>

    <body class="bk-vbox" shortcut="'ctrl+s'" shortcut-action="save">
        <bk-busy-indicator-extended class="bk-fill-parent" ng-hide="state.error || !state.isBusy" size="l">
            {{state.busyText}}
        </bk-busy-indicator-extended>
        <bk-toolbar class="bk-full-width" has-title="true" ng-show="!state.error && !state.isBusy">
            <bk-toolbar-title>Report:</bk-toolbar-title>
            <bk-toolbar-spacer></bk-toolbar-spacer>
            <bk-button compact="true" label="Save" state="emphasized" ng-click="save()" ng-disabled="!(forms.editor.$valid && changed)"></bk-button>
        </bk-toolbar>
        <bk-scrollbar class="bk-full-width" ng-show="!state.error && !state.isBusy">
            <bk-fieldset ng-form="forms.editor">
                <bk-form-group name="entityForm">
                    <!-- Begin General Section-->
                    <bk-panel expanded="true">
                        <bk-panel-header>
                            <bk-panel-expand hint="expand general section"></bk-panel-expand>
                            <h4 bk-panel-title>General</h4>
                        </bk-panel-header>
                        <bk-panel-content aria-label="General Content" class="bk-scroll-hidden">
                            <bk-form-item horizontal="false">
                                <bk-form-label for="label" ng-required="true" colon="true">Label</bk-form-label>
                                <bk-input id="idLabel" name="label" state="{{ forms.editor['label'].$valid ? '' : 'error' }}" ng-required="true" ng-model="report.label" ng-maxlength="255" type="text" placeholder="Enter label">
                                </bk-input>
                            </bk-form-item>
                            <bk-form-item horizontal="false">
                                <bk-form-label for="name" ng-required="true" colon="true">Name</bk-form-label>
                                <bk-form-input-message state="{{ forms.editor['name'].$valid ? '' : 'error' }}" message="::nameErrorMessage">
                                    <bk-input id="idName" name="name" state="{{ forms.editor['name'].$valid ? '' : 'error' }}" ng-required="true" ng-model="report.name" ng-maxlength="255" input-rules="nameRegex" type="text"
                                        placeholder="Enter name">
                                    </bk-input>
                                </bk-form-input-message>
                            </bk-form-item>
                        </bk-panel-content>
                    </bk-panel>
                    <!-- End General Section-->
                    <!-- Begin Base Table Section-->
                    <bk-panel expanded="true">
                        <bk-panel-header>
                            <bk-panel-expand hint="expand base table section"></bk-panel-expand>
                            <h4 bk-panel-title>Base Table</h4>
                        </bk-panel-header>
                        <bk-panel-content aria-label="Base Table Content" class="bk-scroll-hidden">
                            <div class="bk-hbox bk-full-width bk-padding-bottom--tiny bk-flex-end bk-box--gap">
                                <bk-button compact="true" label="Set from Tables" ng-click="setBaseTable()"></bk-button>
                            </div>
                            <bk-form-item horizontal="false">
                                <bk-form-label for="alias" ng-required="true" colon="true">Alias</bk-form-label>
                                <bk-form-input-message state="{{ forms.editor['alias'].$valid ? '' : 'error' }}" message="::nameErrorMessage">
                                    <bk-input id="idAlias" name="alias" state="{{ forms.editor['alias'].$valid ? '' : 'error' }}" ng-required="true" ng-model="report.alias" ng-maxlength="255" input-rules="nameRegex" type="text"
                                        placeholder="Enter alias name">
                                    </bk-input>
                                </bk-form-input-message>
                            </bk-form-item>
                            <bk-form-item horizontal="false">
                                <bk-form-label for="table" ng-required="true" colon="true">Table</bk-form-label>
                                <bk-form-input-message state="{{ forms.editor['table'].$valid ? '' : 'error' }}" message="::nameErrorMessage">
                                    <bk-input id="idTable" name="table" state="{{ forms.editor['table'].$valid ? '' : 'error' }}" ng-required="true" ng-model="report.table" ng-maxlength="255" input-rules="nameRegex" type="text"
                                        placeholder="Enter table name">
                                    </bk-input>
                                </bk-form-input-message>
                            </bk-form-item>
                        </bk-panel-content>
                    </bk-panel>
                    <!-- End Base Table Section-->
                    <!-- Begin Columns -->
                    <bk-panel expanded="true">
                        <bk-panel-header>
                            <bk-panel-expand hint="expand columns section"></bk-panel-expand>
                            <h4 bk-panel-title>Columns</h4>
                        </bk-panel-header>
                        <bk-panel-content aria-label="Columns Content">
                            <div class="bk-hbox bk-full-width bk-padding-bottom--tiny bk-flex-end bk-box--gap">
                                <bk-button compact="true" glyph="sap-icon--add" label="Add" ng-click="addColumn()"></bk-button>
                            </div>
                            <bk-table-fixed>
                                <table bk-table outer-borders="all">
                                    <thead bk-table-header>
                                        <tr bk-table-row>
                                            <th bk-table-header-cell>Label</th>
                                            <th bk-table-header-cell>Table Alias</th>
                                            <th bk-table-header-cell>Column Alias</th>
                                            <th bk-table-header-cell>Column Name</th>
                                            <th bk-table-header-cell>Column Type</th>
                                            <th bk-table-header-cell>Aggregate Function</th>
                                            <th bk-table-header-cell>Select</th>
                                            <th bk-table-header-cell>Grouping</th>
                                            <th bk-table-header-cell></th>
                                        </tr>
                                    </thead>
                                    <tbody bk-table-body>
                                        <tr ng-if="!report.columns || report.columns.length === 0" bk-table-row>
                                            <td bk-table-cell no-data="true">Report has no columns</td>
                                        </tr>
                                        <tr bk-table-row hoverable="false" activable="false" ng-repeat="item in report.columns track by $index">
                                            <td bk-table-cell>{{item.label}}</td>
                                            <td bk-table-cell>{{item.table}}</td>
                                            <td bk-table-cell>{{item.alias}}</td>
                                            <td bk-table-cell>{{item.name}}</td>
                                            <td bk-table-cell>{{item.type}}</td>
                                            <td bk-table-cell>{{item.aggregate}}</td>
                                            <td bk-table-cell><span bk-object-status status="{{ item.select ? 'positive' : 'negative' }}" text="{{ item.select ? 'True' : 'False' }}"></span></td>
                                            <td bk-table-cell><span bk-object-status status="{{ item.grouping ? 'positive' : 'negative' }}" text="{{ item.grouping ? 'True' : 'False' }}"></span></td>
                                            <td bk-table-cell fit-content="true">
                                                <bk-button glyph="sap-icon--edit" state="transparent" aria-label="Edit" ng-click="editColumn($index)"></bk-button>
                                                <bk-button glyph="sap-icon--delete" state="transparent" aria-label="Delete" ng-click="deleteColumn($index)"></bk-button>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </bk-table-fixed>
                        </bk-panel-content>
                    </bk-panel>
                    <!-- End Columns -->
                    <!-- Begin Joins -->
                    <bk-panel expanded="true">
                        <bk-panel-header>
                            <bk-panel-expand hint="expand joins section"></bk-panel-expand>
                            <h4 bk-panel-title>Joins</h4>
                        </bk-panel-header>
                        <bk-panel-content aria-label="Joins Content">
                            <div class="bk-hbox bk-full-width bk-padding-bottom--tiny bk-flex-end bk-box--gap">
                                <bk-button compact="true" glyph="sap-icon--add" label="Add" ng-click="addJoin()"></bk-button>
                                <bk-button compact="true" label="Add from Tables" ng-click="addFromTables()">
                                </bk-button>
                            </div>
                            <bk-table-fixed>
                                <table bk-table outer-borders="all">
                                    <thead bk-table-header>
                                        <tr bk-table-row>
                                            <th bk-table-header-cell>Alias</th>
                                            <th bk-table-header-cell>Name</th>
                                            <th bk-table-header-cell>Type</th>
                                            <th bk-table-header-cell>Condition</th>
                                            <th bk-table-header-cell></th>
                                        </tr>
                                    </thead>
                                    <tbody bk-table-body>
                                        <tr ng-if="!report.joins || report.joins.length === 0" bk-table-row>
                                            <td bk-table-cell no-data="true">Report has no joins</td>
                                        </tr>
                                        <tr bk-table-row hoverable="false" activable="false" ng-repeat="item in report.joins track by $index">
                                            <td bk-table-cell>{{item.alias}}</td>
                                            <td bk-table-cell>{{item.name}}</td>
                                            <td bk-table-cell>{{item.type}}</td>
                                            <td bk-table-cell>{{item.condition}}</td>
                                            <td bk-table-cell fit-content="true">
                                                <bk-button compact="true" glyph="sap-icon--edit" state="transparent" aria-label="Edit" ng-click="editJoin($index)"></bk-button>
                                                <bk-button compact="true" glyph="sap-icon--delete" state="transparent" aria-label="Delete" ng-click="deleteJoin($index)"></bk-button>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </bk-table-fixed>
                        </bk-panel-content>
                    </bk-panel>
                    <!-- End Joins -->
                    <!-- Begin Conditions -->
                    <bk-panel expanded="true">
                        <bk-panel-header>
                            <bk-panel-expand hint="expand conditions section"></bk-panel-expand>
                            <h4 bk-panel-title>Conditions</h4>
                        </bk-panel-header>
                        <bk-panel-content aria-label="Conditions Content">
                            <div class="bk-hbox bk-full-width bk-padding-bottom--tiny bk-flex-end bk-box--gap">
                                <bk-button compact="true" glyph="sap-icon--add" label="Add" ng-click="addCondition()"></bk-button>
                            </div>
                            <bk-table-fixed>
                                <table bk-table outer-borders="all">
                                    <thead bk-table-header>
                                        <tr bk-table-row>
                                            <th bk-table-header-cell>Left</th>
                                            <th bk-table-header-cell>Operation</th>
                                            <th bk-table-header-cell>Right</th>
                                            <th bk-table-header-cell></th>
                                        </tr>
                                    </thead>
                                    <tbody bk-table-body>
                                        <tr ng-if="!report.conditions || report.conditions.length === 0" bk-table-row>
                                            <td bk-table-cell no-data="true">Report has no conditions</td>
                                        </tr>
                                        <tr bk-table-row hoverable="false" activable="false" ng-repeat="item in report.conditions track by $index">
                                            <td bk-table-cell>{{item.left}}</td>
                                            <td bk-table-cell>{{item.operation}}</td>
                                            <td bk-table-cell>{{item.right}}</td>
                                            <td bk-table-cell fit-content="true">
                                                <bk-button compact="true" glyph="sap-icon--edit" state="transparent" aria-label="Edit" ng-click="editCondition($index)"></bk-button>
                                                <bk-button compact="true" glyph="sap-icon--delete" state="transparent" aria-label="Delete" ng-click="deleteCondition($index)"></bk-button>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </bk-table-fixed>
                        </bk-panel-content>
                    </bk-panel>
                    <!-- End Conditions -->
                    <!-- Begin Havings -->
                    <bk-panel expanded="false">
                        <bk-panel-header>
                            <bk-panel-expand hint="expand havings section"></bk-panel-expand>
                            <h4 bk-panel-title>Havings</h4>
                        </bk-panel-header>
                        <bk-panel-content aria-label="Havings Content">
                            <div class="bk-hbox bk-full-width bk-padding-bottom--tiny bk-flex-end bk-box--gap">
                                <bk-button compact="true" glyph="sap-icon--add" label="Add" ng-click="addHaving()"></bk-button>
                            </div>
                            <bk-table-fixed>
                                <table bk-table outer-borders="all">
                                    <thead bk-table-header>
                                        <tr bk-table-row>
                                            <th bk-table-header-cell>Left</th>
                                            <th bk-table-header-cell>Operation</th>
                                            <th bk-table-header-cell>Right</th>
                                            <th bk-table-header-cell></th>
                                        </tr>
                                    </thead>
                                    <tbody bk-table-body>
                                        <tr ng-if="!report.havings || report.havings.length === 0" bk-table-row>
                                            <td bk-table-cell no-data="true">Report has no havings</td>
                                        </tr>
                                        <tr bk-table-row hoverable="false" activable="false" ng-repeat="item in report.havings track by $index">
                                            <td bk-table-cell>{{item.left}}</td>
                                            <td bk-table-cell>{{item.operation}}</td>
                                            <td bk-table-cell>{{item.right}}</td>
                                            <td bk-table-cell fit-content="true">
                                                <bk-button compact="true" glyph="sap-icon--edit" state="transparent" aria-label="Edit" ng-click="editHaving($index)"></bk-button>
                                                <bk-button compact="true" glyph="sap-icon--delete" state="transparent" aria-label="Delete" ng-click="deleteHaving($index)"></bk-button>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </bk-table-fixed>
                        </bk-panel-content>
                    </bk-panel>
                    <!-- End Conditions -->
                    <!-- Begin Ordering -->
                    <bk-panel expanded="false">
                        <bk-panel-header>
                            <bk-panel-expand hint="expand ordering section"></bk-panel-expand>
                            <h4 bk-panel-title>Ordering</h4>
                        </bk-panel-header>
                        <bk-panel-content aria-label="Ordering Content">
                            <div class="bk-hbox bk-full-width bk-padding-bottom--tiny bk-flex-end bk-box--gap">
                                <bk-button compact="true" glyph="sap-icon--add" label="Add" ng-click="addOrdering()"></bk-button>
                            </div>
                            <bk-table-fixed>
                                <table bk-table outer-borders="all">
                                    <thead bk-table-header>
                                        <tr bk-table-row>
                                            <th bk-table-header-cell>Column</th>
                                            <th bk-table-header-cell>Direction</th>
                                            <th bk-table-header-cell></th>
                                        </tr>
                                    </thead>
                                    <tbody bk-table-body>
                                        <tr ng-if="!report.orderings || report.orderings.length === 0" bk-table-row>
                                            <td bk-table-cell no-data="true">Report has no ordering</td>
                                        </tr>
                                        <tr bk-table-row hoverable="false" activable="false" ng-repeat="item in report.orderings track by $index">
                                            <td bk-table-cell>{{item.column}}</td>
                                            <td bk-table-cell>{{item.direction}}</td>
                                            <td bk-table-cell fit-content="true">
                                                <bk-button compact="true" glyph="sap-icon--edit" status="transparent" aria-label="Edit" ng-click="editOrdering($index)"></bk-button>
                                                <bk-button compact="true" glyph="sap-icon--delete" status="transparent" aria-label="Delete" ng-click="deleteOrdering($index)"></bk-button>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </bk-table-fixed>
                        </bk-panel-content>
                    </bk-panel>
                    <!-- End Ordering -->
                    <!-- Begin Parameters -->
                    <bk-panel expanded="true">
                        <bk-panel-header>
                            <bk-panel-expand hint="expand parameters section"></bk-panel-expand>
                            <h4 bk-panel-title>Parameters</h4>
                        </bk-panel-header>
                        <bk-panel-content aria-label="Parameters Content">
                            <div class="bk-hbox bk-full-width bk-padding-bottom--tiny bk-flex-end bk-box--gap">
                                <bk-button compact="true" glyph="sap-icon--add" label="Add" ng-click="addParameter()"></bk-button>
                            </div>
                            <bk-table-fixed>
                                <table bk-table outer-borders="all">
                                    <thead bk-table-header>
                                        <tr bk-table-row>
                                            <th bk-table-header-cell>Parameter Name</th>
                                            <th bk-table-header-cell>Parameter Type</th>
                                            <th bk-table-header-cell>Initial Value</th>
                                            <th bk-table-header-cell></th>
                                        </tr>
                                    </thead>
                                    <tbody bk-table-body>
                                        <tr ng-if="!report.parameters || report.parameters.length === 0" bk-table-row>
                                            <td bk-table-cell no-data="true">Report has no parameters</td>
                                        </tr>
                                        <tr bk-table-row hoverable="false" activable="false" ng-repeat="item in report.parameters track by $index">
                                            <td bk-table-cell>{{item.name}}</td>
                                            <td bk-table-cell>{{item.type}}</td>
                                            <td bk-table-cell>{{item.initial}}</td>
                                            <td bk-table-cell fit-content="true">
                                                <bk-button compact="true" glyph="sap-icon--edit" status="transparent" aria-label="Edit" ng-click="editParameter($index)"></bk-button>
                                                <bk-button compact="true" glyph="sap-icon--delete" status="transparent" aria-label="Delete" ng-click="deleteParameter($index)"></bk-button>
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </bk-table-fixed>
                        </bk-panel-content>
                    </bk-panel>
                    <!-- End Parameters -->
                    <!-- Begin Query -->
                    <bk-panel expanded="false">
                        <bk-panel-header>
                            <bk-panel-expand hint="expand query section"></bk-panel-expand>
                            <h4 bk-panel-title>Query</h4>
                        </bk-panel-header>
                        <bk-panel-content aria-label="Query Content">
                            <bk-form-item horizontal="false">
                                <bk-form-label for="idQuery" colon="true">Generated Query</bk-form-label>
                                <bk-textarea id="idQuery" name="query" ng-model="query" rows="10" ng-readonly="true"></bk-textarea>
                            </bk-form-item>
                        </bk-panel-content>
                    </bk-panel>
                    <!-- End Query -->
                    <!-- Begin Security -->
                    <bk-panel expanded="false">
                        <bk-panel-header>
                            <bk-panel-expand hint="expand security section"></bk-panel-expand>
                            <h4 bk-panel-title>Security</h4>
                        </bk-panel-header>
                        <bk-panel-content aria-label="Security">
                            <bk-form-group class="fd-container fd-form-layout-grid-container">
                                <bk-form-item class="fd-row">
                                    <div class="fd-col fd-col-md--2">
                                        <bk-form-label for="srr" colon="true">Read role</bk-form-label>
                                    </div>
                                    <div class="fd-col fd-col-md--4 fd-col-lg--3">
                                        <bk-input id="srr" type="text" ng-model="report.security.roleRead" placeholder="role name" ng-disabled="report.security.generateDefaultRoles === 'true'"></bk-input>
                                    </div>
                                </bk-form-item>
                                <bk-form-item class="fd-row fd-margin-top--tiny">
                                    <div class="fd-col fd-col-md--2"></div>
                                    <bk-checkbox id="generalGenerateDefaultRoles" ng-model="report.security.generateDefaultRoles" data-ng-true-value="'true'" data-ng-false-value="'false'" ng-change="toggleDefaultRoles()"></bk-checkbox>
                                    <bk-checkbox-label for="generalGenerateDefaultRoles">Generate Default Roles</bk-checkbox-label>
                                </bk-form-item>
                            </bk-form-group>
                        </bk-panel-content>
                    </bk-panel>
                    <!-- End Security -->
                </bk-form-group>
            </bk-fieldset>
        </bk-scrollbar>
        <bk-message-page glyph="sap-icon--error" ng-if="state.error">
            <bk-message-page-title>Editor encounterd an error!</bk-message-page-title>
            <bk-message-page-subtitle>{{errorMessage}}</bk-message-page-subtitle>
        </bk-message-page>
        <theme></theme>
    </body>

</html>
